@layout("/common/_container.html"){
<div class="ibox float-e-margins">
    <div class="ibox-content">
        <div class="row">
            <div class="col-sm-3">
                <div class="card" style="padding: 8px;height: 200px;">
                    <!--<img class="card-img-top" data-src="holder.js/100%x180/" alt="Card image cap">
                    /initialOrder
                    -->
                    <div class="card-block" style="text-align: center">
                        <div class="layui-anim1" data-anim="layui-anim-up">
                            <a class="J_menuItem" name="tabMenuItem" href="${ctxPath}initialOrder">
                            <img src="${ctxPath}/static/img/kd.jpg"
                                 style="width: 120px;height: 120px;border-radius: 5%;">
                            </a>
                        </div>
                        <span  style="color: #0E0E0E;font-size: 2em;"
                          >开单</span>
                    </div>
                </div>
            </div>
            <div class="col-sm-3">

                <div class="card" style="padding: 8px;height: 200px;">
                    <!--<img class="card-img-top" data-src="holder.js/100%x180/" alt="Card image cap">
                    /initialOrder
                    -->
                    <div class="card-block" style="text-align: center">
                        <div class="layui-anim1" data-anim="layui-anim-up">
                            <a class="J_menuItem" name="tabMenuItem" href="${ctxPath}tOrder/outIndex">
                                <img src="${ctxPath}/static/img/zt.jpg"
                                     style="width: 120px;height: 120px;border-radius: 5%;">
                            </a>
                            <span id="zt"
                                  style="position: fixed;top: 127px;font-size: 16px;padding-left: 30px;">0</span>
                        </div>
                        <span style="color: #0E0E0E;font-size: 2em;">自提</span>
                    </div>
                </div>

            </div>
            <div class="col-sm-3">
                <div class="card-block" style="text-align: center">
                    <div class="layui-anim1" data-anim="layui-anim-up">
                        <a class="J_menuItem" name="tabMenuItem" href="${ctxPath}tOrder/distributionList">
                            <img src="${ctxPath}/static/img/ps.jpg"
                                 style="width: 120px;height: 120px;border-radius: 5%;">
                        </a>
                        <span id="ps" style="position: fixed;top: 120px;font-size: 16px;padding-left: 40px;">0</span>
                    </div>
                    <span style="color: #0E0E0E;font-size: 2em;">配送</span>
                </div>
            </div>
            <div class="col-sm-3">
                <!--<img class="card-img-top" data-src="holder.js/100%x180/" alt="Card image cap">-->
                <div class="card-block" style="text-align: center">
                    <div class="layui-anim1" data-anim="layui-anim-up">
                        <a class="J_menuItem" name="tabMenuItem" href="${ctxPath}/tOrder/indexTransfer">
                            <img src="${ctxPath}/static/img/zz.jpg"
                                 style="width: 120px;height: 120px;border-radius: 5%;">
                        </a>
                        <span id="zz" style="position: fixed;top: 120px;font-size: 16px;padding-left: 40px;">0</span>
                    </div>
                    <span style="color: #0E0E0E;font-size: 2em;">中转</span>
                </div>
            </div>
        </div>
        <div class="row">
            <div class="col-sm-3">
                <div class="card" style="padding: 8px;height: 200px;">
                    <!--<img class="card-img-top" data-src="holder.js/100%x180/" alt="Card image cap">
                    /initialOrder
                    -->
                    <div class="card-block" style="text-align: center">
                        <div class="layui-anim1" data-anim="layui-anim-up">
                            <a class="J_menuItem" href="${ctxPath}orderBack" name="tabMenuItem">
                                <img src="${ctxPath}/static/img/hd.jpg"
                                     style="width: 120px;height: 120px;border-radius: 5%;">
                            </a>

                        </div>
                        <span  style="color: #0E0E0E;font-size: 2em;"
                           >回单</span>
                    </div>
                </div>
            </div>
            <div class="col-sm-3">
                <div class="card" style="padding: 8px;height: 200px;">
                    <!--<img class="card-img-top" data-src="holder.js/100%x180/" alt="Card image cap">
                    /initialOrder
                    -->
                    <div class="card-block" style="text-align: center">
                        <div class="layui-anim1" data-anim="layui-anim-up">
                            <a  class="J_menuItem"  href="${ctxPath}monthbalance" name="tabMenuItem">
                            <img src="${ctxPath}/static/img/gz.jpg"
                                 style="width: 120px;height: 120px;border-radius: 5%;">
                            </a>
                        </div>
                        <span style="color: #0E0E0E;font-size: 2em;"
                           >挂账管理</span>
                    </div>
                </div>
            </div>
            <div class="col-sm-3">
                <div class="card" style="padding: 8px;height: 200px;">
                    <!--<img class="card-img-top" data-src="holder.js/100%x180/" alt="Card image cap">
                    /initialOrder
                    -->
                    <div class="card-block" style="text-align: center">
                        <div class="layui-anim1" data-anim="layui-anim-up">
                            <a class="J_menuItem"  href="${ctxPath}tBill/accountingRecord"  name="tabMenuItem">
                                <img src="${ctxPath}/static/img/zm.jpg"
                                     style="width: 120px;height: 120px;border-radius: 5%;">
                            </a>
                        </div>
                        <span  style="color: #0E0E0E;font-size: 2em;"
                          >账目管理</span>
                    </div>
                </div>
            </div>
        </div>

    </div>
</div>
<style>
    .layui-anim {
        width: 120px;
        height: 120px;
        line-height: 120px;
        margin: 0 auto 10px;
        text-align: center;
        background-color: #009688;
        cursor: pointer;
        color: #fff;
        border-radius: 50%;
        font-size: 3em;
    }

    .layui-anim1 {
        width: 120px;
        height: 120px;
        line-height: 120px;
        margin: 30px 0px 0px 50px;
        text-align: center;
        cursor: pointer;
        color: #fff;
        border-radius: 5%;
        margin-bottom: 10px;
        font-size: 3em;
    }

    .code {
        text-align: center;
        cursor: pointer;
        color: #fff;
        font-size: 2em;
    }
</style>
<script type="text/javascript" src="${ctxPath}/static/js/contabs.js"></script>
<script>

    var ajax = new $ax(Feng.ctxPath + "/tOrder/orderIndex", function (data) {
        $('#zt').text(data.b);
        $('#ps').text(data.a);
        $('#zz').text(data.c);
    }, function (data) {

    });
    ajax.start();

    function menuItem() {
        // 获取标识数据
        var dataUrl = $(this).attr('href'),
            dataIndex = $(this).data('index'),
            menuName = $.trim($(this).text()),
            flag = true;

        if (dataUrl.indexOf("0") != -1) {
            menuName = "自提审核";
        } else if (dataUrl.indexOf("1") != -1) {
            menuName = "配送审核";
        } else if (dataUrl.indexOf("2") != -1) {
            menuName = "中转审核";
        }

        if (dataUrl == undefined || $.trim(dataUrl).length == 0) return false;

        // 选项卡菜单已存在
        var J_menuTab = $(".J_menuTab", window.parent.document);
        $(J_menuTab).each(function () {
            if ($(this).data('id') == dataUrl) {
                if (!$(this).hasClass('active')) {
                    $(this).addClass('active').siblings('.J_menuTab').removeClass('active');
                    scrollToTab(this);
                    // 显示tab对应的内容区
                    $(".J_mainContent .J_iframe", window.parent.document).each(function () {
                        if ($(this).data('id') == dataUrl) {
                            $(this).show().siblings('.J_iframe').hide();
                            $(this).attr('src', $(this).attr('src'));
                            return false;
                        }
                    });
                }
                flag = false;
                return false;
            }
        });

        // 选项卡菜单不存在
        if (flag) {
            var str = '<a href="javascript:;" class="active J_menuTab" data-id="' + dataUrl + '">' + menuName + ' <i class="fa fa-times-circle"></i></a>';
            $(".J_menuTab", window.parent.document).removeClass('active');

            // 添加选项卡对应的iframe
            var str1 = '<iframe class="J_iframe" name="iframe' + dataIndex + '" width="100%" height="100%" src="' + dataUrl + '" frameborder="0" data-id="' + dataUrl + '" seamless></iframe>';
//            $('.J_mainContent')
            $(".J_mainContent", window.parent.document).find('iframe.J_iframe').hide().parents('.J_mainContent').append(str1);
            var obj = $(".J_menuTabs .page-tabs-content", window.parent.document);
            $(obj).append(str);

        }
        return false;
    }

    $('.J_menuItem').on('click', menuItem);

</script>

@}
